<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <base href="${request.contextPath}/"/>
    <meta charset="UTF-8">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,minimum-scale=1.0">
    <title>漠河智慧社区</title>
    <!--选项卡-->
    <link rel="stylesheet" href="Content/wechat/css/element.min.css">
    <link href="Content/wechat/css/shengHuo_QCSJ.css" rel="stylesheet" type="text/css">
    <!--end选项卡-->
    <link href="Content/wechat/css/reset.css" rel="stylesheet" type="text/css">
    <!--  <link href="css/index.css" rel="stylesheet" type="text/css">-->
    <link href="Content/wechat/css/ding.css" rel="stylesheet" type="text/css">

    <script src="Content/wechat/js/jquery.min.js"></script>
    <!--页码-->
    <link href="Content/wechat/css/myPagination.css" rel="stylesheet" type="text/css">
    <!--字体缩放-->
    <script src="Content/wechat/js/ziti.js"></script>
    <!--end 字体缩放-->
    <!--页码js-->
    <script src="Content/wechat/js/myPagination.js"></script>
</head>
<body>
<div id="myVue">
    <template>
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="全部" name="first">
                <div class="qyml clearfix" id="htmlBoxAll">

                </div>
            </el-tab-pane>
            <el-tab-pane label="已下单" name="second">
                <div class="qyml clearfix" id="htmlBoxOne">
                </div>
            </el-tab-pane>
            <el-tab-pane label="已发货" name="third">
                <div class="qyml clearfix" id="htmlBoxTwo">
                    /**/
                </div>
            </el-tab-pane>
            <el-tab-pane label="已完成" name="fourth">
                <div class="qyml clearfix" id="htmlBoxthree">

<!--                    <div class="qyml_l">-->
<!--                        <div class="qyml_l_img">-->
<!--                            <img src="Content/wechat/images/sq.jpg">-->
<!--                        </div>-->
<!--                        <div class="qyml_l_wenzi">-->
<!--                            <h3>漠河北区公安局4</h3>-->
<!--                            <p>123分</p>-->
<!--                        </div>-->
<!--                    </div>-->

                </div>
            </el-tab-pane>
        </el-tabs>
    </template>
    </div>
<!--js选项卡-->
<script type="text/javascript" src="Content/wechat/js/vue.min.js"></script>
<script src="Content/wechat/js/element.min.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#myVue',
        data() {
        return {
            activeName: 'second',
            activeName2: 'first',
            tabPosition: 'top',
            editableTabsValue2: '2',
            editableTabs2: [{
                title: 'Tab 1',
                name: '1',
                content: 'Tab 1 content'
            }, {
                title: 'Tab 2',
                name: '2',
                content: 'Tab 2 content'
            }],
            tabIndex: 2
        }
    },
    methods: {
        handleClick(tab, event) {
            console.log(tab, event);
        },
        addTab(targetName) {
            let newTabName = ++this.tabIndex + '';
            this.editableTabs2.push({
                title: 'New Tab',
                name: newTabName,
                content: 'New Tab content'
            });
            this.editableTabsValue2 = newTabName;
        },
        removeTab(targetName) {
            let tabs = this.editableTabs2;
            let activeName = this.editableTabsValue2;
            if(activeName === targetName) {
                tabs.forEach((tab, index) => {
                    if(tab.name === targetName) {
                    let nextTab = tabs[index + 1] || tabs[index - 1];
                    if(nextTab) {
                        activeName = nextTab.name;
                    }
                }
            });
        }

        this.editableTabsValue2 = activeName;
        this.editableTabs2 = tabs.filter(tab => tab.name !== targetName);
    }
    }
    })
</script>
</body>
<script>

    var pageSize = 10000;    //一页显示几个
    window.onload = function () {
        InitAllAjax(1);
        InitOneAjax(1);
        InitTwoAjax(1);
        InitThreeAjax(1);
    }



    function InitAllAjax(pageNum) {
        $.ajax({
            url: "/wechat/personage/GetRecordList",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                status: ""
            }, success: function (result) {
               ajaxCallBack(result,"htmlBoxAll");
            }

        })
    }



    function InitOneAjax(pageNum) {
        $.ajax({
            url: "/wechat/personage/collection/GetRecordList",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                status: ""
            }, success: function (result) {
                ajaxCallBack(result,"htmlBoxOne");
            }

        })
    }

    function InitOneAjax(pageNum) {
        $.ajax({
            url: "/wechat/personage/GetRecordList",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                status: "1"
            }, success: function (result) {
                ajaxCallBack(result,"htmlBoxOne");
            }

        })
    }

    function InitTwoAjax(pageNum) {
        $.ajax({
            url: "/wechat/personage/GetRecordList",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                status: "2"
            }, success: function (result) {
                ajaxCallBack(result,"htmlBoxTwo");
            }

        })
    }

    function InitThreeAjax(pageNum) {
        $.ajax({
            url: "/wechat/personage/GetRecordList",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                status: "3"
            }, success: function (result) {
                ajaxCallBack(result,"htmlBoxthree");
            }

        })
    }

    function ajaxCallBack(data,id) {
        var insetViewData = ""; //视图数据
        $.each(data.data.rows, function (index, items) {
            insetViewData += "<div class=\"qyml_l\" onclick=\"window.location.href='/wechat/personage/order_Info?id="+items.id+"'\">\n" +
                "                        <div class=\"qyml_l_img\">\n" +
                "                            <img src=\""+items.imgUrl+"\">\n" +
                "                        </div>\n" +
                "                        <div class=\"qyml_l_wenzi\">\n" +
                "                            <h3>"+items.name+"</h3>\n" +
                "                            <p>"+items.num+"分</p>\n" +
                "                        </div>\n" +
                "                    </div>";

        });
        $("#"+id).html(insetViewData);
    }
</script>
</html>
